<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>车辆类型及车辆权重配置</title>
    <link rel="shortcut icon" href="favicon.ico">
    <link href="${pageContext.request.contextPath}/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/css/animate.min.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/css/style.min.css?v=4.1.0" rel="stylesheet">
</head>

<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <!-- Panel Other -->
    <div class="ibox float-e-margins">
        <div class="ibox-title">
            <h5>车辆类型及车辆权重</h5>
        </div>
        <div class="ibox-content">
            <div class="row row-lg">
                <div class="col-sm-12">
                    <div class="example-wrap">
                        <!-- start toolbar -->
                        <div class="col-sm-10">
                            <form class="form-horizontal" role="form" id="queryCarTypeForm">
                                    <div class="col-sm-4">
                                        <button type="button" class="btn btn-info" id="" onclick="location.reload();">
                                            <span class="glyphicon glyphicon-refresh" aria-hidden="true"></span> 刷新
                                        </button>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <!-- end toolbar -->
                        <div class="example">
                            <table id="carTypeTab" class="table" data-height="700" data-click-to-select="true" data-mobile-responsive="true">
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- End Panel Other -->
<script src="${pageContext.request.contextPath}/js/jquery.min.js?v=2.1.4"></script>
<script src="${pageContext.request.contextPath}/js/bootstrap.min.js?v=3.3.6"></script>
<script src="${pageContext.request.contextPath}/js/content.min.js?v=1.0.0"></script>
<script src="${pageContext.request.contextPath}/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
<script src="${pageContext.request.contextPath}/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js"></script>
<script src="${pageContext.request.contextPath}/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
<script src="${pageContext.request.contextPath}/js/plugins/layer/layer.min.js"></script>
<script src="${pageContext.request.contextPath}/js/public/ttbj-core.js"></script>
<script type="text/javascript">
var $table = $("#carTypeTab");
$(function () {
    initTable();
});

function initTable() {
    $table.bootstrapTable({
        dataType: "json",
        pagination: true, //分页
        striped: true,
        pageSize: 10,
        pageNumber: 1,
        queryParamsType: 'limit',
        smartDisplay: true,
        sidePagination: "server",
        method: "post",	//使用post提交
        queryParams: queryParams,
        url: '../bill/getCarTypeInfo.htm',
        contentType: 'application/x-www-form-urlencoded;charset=UTF-8',
        columns: [
			{
				title: "序号",
			    align: 'center',
			    formatter:function(value,row,index){
			    	return index + 1;
			    }
			},
            {
                title: "每次费用(元)",
                field: "typePrice",
                align: 'center',
                valign: 'middle'
            },
            {
                title: "车型描述",
                field: "typeNotes",
                align: 'center',
                valign: 'middle'

            },
            {
                title: "车辆类型权重(倍)",
                field: "typeWt",
                align: 'center',
                valign: 'middle'
            },
            {
                title: "更新时间",
                field: "typeUpDateTime",
                align: 'center',
                valign: 'middle'
            },
            {
                title: "是否禁用",
                field: "typeIsDelete",
                align: 'center',
                formatter: function (value, row, index) {
                    var del = row.typeIsDelete;
                    if(del == 0){
                    	return '已禁用';
                    }else if(del == 1){
                    	return '未禁用';
                    }else{
                    	return '';
                    }
                }
            },
            {
                title: "操作",
                align: 'center',
                formatter: function (value, row, index) {
                    var a = '';
                    var b = '';
                    if(row.typeIsDelete == 1){
                    	a = '<button class="btn btn-xs btn-info" type="button" onclick="editCarType(\'' + row.typeId + '\')"><i class="fa fa-edit"></i> 修改 </button>';
                    	b = '<button class="btn btn-xs btn-danger" type="button" onclick="editDisable(\'' + row.typeId + '\',\'' + 0  + '\',\''+ row.typeNotes + '\')"><i class="fa fa-trash-o"></i> 禁用 </button> ';
                    }else {
                    	b = '<button class="btn btn-xs btn-warning" type="button" onclick="editDisable(\'' + row.typeId  + '\',\'' + 1 + '\',\''+ row.typeNotes + '\')"><i class="fa fa-trash-o"></i> 启用 </button> ';
                    }
                    return a+b;
                }
            }
        ],
        onClickRow: function(row, $element, field){	//当点击某一行时，该行背景颜色改变
        	var trObj = $($element[0]);
        	var dataIndex = trObj.attr('data-index');
        	$("tr[data-index != '" + dataIndex + "']").removeAttr('style');
        	trObj.attr('style', 'background: #B4EEB4');
        }
    });
}


//分页参数，条件查询时的参数
function queryParams(queryParamsType){
	var temp = {
		limit: queryParamsType.limit,   //页面大小
		offset: queryParamsType.offset  //页码
	};
	return temp;
}

//编辑时间信息
function editCarType(typeId){
    var index = layer.open({
        type: 2,
        title: '编辑',
        maxmin: true,
        shadeClose: false, //点击遮罩关闭层
        area : ['500px' , '550px'],
        content: '../bill/edit_bill_car_type.htm?typeId='+typeId,
        success: function(layero, index){
        }
    });
}

//修改禁用或启用
function editDisable(typeId, isDelete, notes) {
    layer.confirm('你确定要修改【' + notes + '】此状态吗？', {
        btn: ['修改', '取消'] //按钮
    }, function () {
        $.ajax({
            url: "../bill/modifyCarTypeInfoIsDel.htm",
            cache: false,
            type: "post",
            dataType: "json",
            data: {"typeId":typeId, "typeIsDelete":isDelete, "typeUpDateTime":new Date().Format("yyyy-MM-dd hh:mm:ss")},
            success: function (result) {
                if (result.status == 0) {
                    layer.msg(result.message, {icon: 1});
                    $table.bootstrapTable('refresh', {url: '../bill/getCarTypeInfo.htm'});
                    return;
                }
                layer.msg(result.message, {icon: 2});
            }
        });
    }, function () {
    });
}
</script>
</body>
</html>
